@use "sass:color";
@import "../../../../style/pc/fk/theme";
@import "../../../both-scroll-area/style/fk";
@import "../../../checkbox/style/fk";
@import "../../../radio/style/fk";
@import "../../../../style/pc/fk/tippy-theme-widget";
.lexmis-Table{
	$cell-padding-v:5px;
	$cell-padding-h:10px;
	$background-color:#E8E8E8;
	background:#fff;
	display:flex;
	flex-direction:column;
	position:relative;
	&.lexmis--hoverable{
		>.lexmis_body{
			tr:not(.lms--Highlighted){
				&:hover{
					background:$-table-hover-color;
					td,th{
						&:before{
							background:$-table-hover-color;
						}
					}
				}
			}
		}
	}
	&.lexmis--border{
		&:before,&:after{
			content:'';
			position:absolute;
			z-index:$-decorate-index;
			top:0;
			height:100%;
		}
		&:before{
			left:0;
			border-left:1px solid $-border-color;
		}
		&:after{
			right:0;
			border-right:1px solid $-border-color;
		}
		>.lexmis_head{
			table{
				border-top:1px solid $-border-color;
			}
		}
		table{
			td,th{
				border-right:1px solid $-border-color;
			}
		}
	}
	>.lexmis_head{
		position:relative;
		flex-shrink:0;
		background:$background-color;
		overflow:hidden;
		color:$-title-color;
		table{
			td,th{
				border-right:1px solid $-border-color;
				background:$background-color !important;
			}
		}
		.lms-Table_customColumns{
			display:flex;
			position:absolute;
			left:0;
			top:0;
			height:100%;
			border:1px solid color.scale($-border-color,$lightness:-10%);
			justify-content:center;
			align-items:center;
			background: color.scale($background-color,$lightness:-10%);
			cursor:pointer;
			user-select:none;
			font-size:18px;
			z-index:-1;
		}
		&:hover{
			.lms-Table_customColumns{
				z-index:29;
			}
		}
	}
	>.lexmis_summary{
		flex-shrink:0;
		background:$background-color;
		overflow:hidden;
		color:$-title-color;
		table{
			td,th{
				border-right:1px solid $-border-color;
				background:$background-color !important;
			}
		}
	}
	>.lexmis_body{
		flex-grow:1;
		flex-basis:0;
		position:relative;
		z-index:1;
		color:$-title-color;
		&:after{
			content:'';
			position:absolute;
			left:0;
			bottom:0;
			width:100%;
			border-bottom:1px solid $-border-color;
		}
		.lexmis_full_content{
			display:flex;
			justify-content:center;
			align-items:center;
			text-align:center;
			position:absolute;
			top:50%;
			left:50%;
			transform:translate(-50%,-50%);
			>.lexmis_spinner{
				font-size:$-component-loading-size;
				color:$-primary-color;
			}
		}
		tr{
			&.lms--Highlighted{
				background:$-table-Highlight-color;
				td,th{
					&:before{
						background:$-table-Highlight-color;
					}
				}
			}
		}
	}
	.lexmis_expandedLine{
		>td{
			padding:0;
			height:auto;
		}
	}
	table{
		border-collapse:separate;
		border-spacing:0;
		table-layout:fixed;
		td,th{
			word-break:break-all;
			padding:$cell-padding-v $cell-padding-h;
			height:36px;
			font-size:14px;
			font-weight:normal;
			border-bottom:1px solid $-border-color;
			&.lexmis--sticky{
				position:sticky;
				z-index:19;
				background:#fff;
				&:before{
					content:'';
					position:absolute;
					z-index:-1;
					left:0;
					top:0;
					width:100%;
					height:100%;
				}
				&.lexmis--edge{
					&:after{
						content:'';
						position:absolute;
						top:0;
						bottom:-1px;
						width:30px;
						pointer-events:none;
					}
				}
				&.lexmis--edge.lexmis--left{
					border-right:0;
					&:after{
						right:0;
						transform:translateX(100%);
						box-shadow:inset 10px 0 8px -8px #c7c7c7;
					}
				}
				&.lexmis--edge.lexmis--right:after{
					left:0;
					transform:translateX(-100%);
					box-shadow:inset -10px 0 8px -8px #c7c7c7;
				}
				&.lexmis--right{
					.lms-Table_resizable{
						left:-$cell-padding-h;
					}
				}
			}
			&.lexmis--last{
				border-right:0;
			}
			>.lexmis_content{
				@include tree-node;
				>.lexmis_tableExpandedIcon{
					font-size:$-box-size;
					color:$-sub-color;
					transition:transform $-arrow-transition;
					cursor:pointer;
					&.lexmis--disable{
						cursor:not-allowed;
					}
					&.lexmis--expanded{
						transform:rotate(90deg);
					}
				}
			}
		}
	}
	.lms-Table_wrapper{
		position:relative;
		height:100%;
		display:flex;
		align-items:center;
	}
	.lms-Table_realCell{
		flex-grow:1;
		flex-basis:0;
	}
	.lms-Table_extra{
		flex-shrink:0;
	}
	.lms-Table_sortableContainer{
		$width:10px;
		$height:7px;
		width:$width;
		height:$height * 2 + 4;
		position:relative;
		>.lms--up,>.lms--down{
			position:absolute;
			width:100%;
			color:$-sub-color;
			left:0;
			border-left:#{$width / 2} solid transparent;
			border-right:#{$width / 2} solid transparent;
			cursor:pointer;
			&:hover{
				color:$-content-color;
			}
			&.lms--active{
				color:$-primary-color;
			}
		}
		>.lms--up{
			top:0;
			border-bottom:$height solid;
		}
		>.lms--down{
			bottom:0;
			border-top:$height solid;
		}
	}
	.lms-Table_resizable{
		height:calc(100% + #{$cell-padding-v * 2});
		width:6px;
		position:absolute;
		top:-$cell-padding-v;
		right:-$cell-padding-h;
		z-index:9;
		cursor:col-resize;
		transition:background-color .3s;
		&:hover,&:active{
			background: color.scale($background-color,$lightness:-5%);
		}
	}
	.lms-Table_resizableLine{
		position:absolute;
		height:100%;
		border-left:1px solid color.scale($-border-color,$lightness:-10%);
		z-index:39;
	}
}
.tippy-box[data-theme~='lexmis-widget']{
	.lms-Table_customColumnsContent{
		white-space:nowrap;
		color:$-title-color;
		display:flex;
		flex-direction:column;
		padding:5px 0;
		.lexmis-Checkbox{
			padding:3px 10px;
		}
	}
}
